<!DOCTYPE html>
<html lang="en">
<head>


       

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>Portfolio | DarkWhite</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/font-awesome.min.css" rel="stylesheet">
    <link href="css/prettyPhoto.css" rel="stylesheet">
    <link href="css/animate.min.css" rel="stylesheet">
    <link href="css/portfolio.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">
    <link href="css/responsive.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/plugins.css">
    <!-- <link href="css/bootstrap.css" rel="stylesheet"> -->
    
   
    
    <!-- FAVICON -->
    <link rel="shortcut icon" href="images/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="images/ico/apple-touch-icon-57-precomposed.png">
     
</head><!--/head-->
<body>

    
        <header id="main_header">
        
            </header><!--/header-->
    <!-- PRELOADER -->
    <!-- <div class="preloader">
           
        <div class="spinner"></div>
        
    </div> -->
    <!-- /PRELOADER -->

        
    <div class="container">
        <div class="carousel slide"  data-ride="carousel"  id="xzCarousel">
        <!-- 轮播广告内容 -->
            <div class="carousel-inner">
            <!-- 动态轮播内容 -->
            </div>
         <!-- 翻页控制器 -->
        <a class="carousel-control left" href="#xzCarousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
        <a class="carousel-control right" href="#xzCarousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
        </a>
    </div>
    </div>   <!--container-->




    <!-- CONTENT AREA -->
    <div class="content-area">


        <!-- CONTENT AREA INNER --> 
        <div id="content-area" class="content-area-inner">
            
            <section id="intro">
                <div class="content-name">
                <!-- 填充动态姓名，介绍 -->
                </div>
           
            
                <!-- ANIMATION CONTAINER -->
                <div class="container-mid">
                    <div class="animation-container animation-fade-up" data-animation-delay="600">
              
                        <a href="#contact" class="smooth-scroll">Learn More<i class="fa fa-angle-down" aria-hidden="true"></i></a>
            
                    </div>
                </div>
            </section>
     
            
            <!-- CONTACT -->
            <section id="contact">


                <h2 class="headline scroll-animated-from-right">联系他们</h2>
                
                
                <!-- CONTACT LIST -->
                <ul class="contact-list">
                   
                    <li class="scroll-animated-from-right"><i class="fa fa-mobile" aria-hidden="true"></i>13688886666</li>
                    <li class="scroll-animated-from-right"><i class="fa fa-envelope-o" aria-hidden="true"></i>sunxiaochuan258@mail.com</li>
                    
                </ul>
                <!-- /CONTACT LIST -->
                
                
                <!-- CONTACT FORM --> 
                <form id="contact-form" action="assets/php/contact.php" method="post">

                   
                    <input id="contact-form-name" type="text" name="name" class="form-control scroll-animated-from-right" placeholder="* 你的姓名">
                    
                    <input id="contact-form-email" type="text" name="email" class="form-control scroll-animated-from-right" placeholder="* 你的邮箱">
                    
                    <!-- PHANTOM ELEMENT ( HONEYPOT CAPTCHA FOR SECURITY ) -->
                    <div class="fhp-input"><input id="contact-form-company" type="text" name="company" class="form-control"></div>
                    <!-- /PHANTOM ELEMENT ( HONEYPOT CAPTCHA FOR SECURITY ) -->
                    
                    <textarea id="contact-form-message" name="message" class="form-control scroll-animated-from-right" placeholder="* 你的联系方式"></textarea>
                    
                    <button type="button" id="sendemail" class="form-control scroll-animated-from-right">发送邮件</button>
                    
                    <div class="success-message">* 邮件已经成功发送!</div>

               
                </form>
                <!-- /CONTACT FORM --> 


            </section>
         
    
            
            
       


        </div>
     


    </div>
    <!-- /CONTENT AREA -->

    
 

    <section id="bottom">
        <div id="bottom2" class="container wow fadeInDown" data-wow-duration="1000ms" data-wow-delay="600ms">
           
        </div>
    </section>

    <footer id="footer" class="midnight-blue">
        <div class="container">
            <div class="row">
                <div class="col-sm-6">
                    &copy; 2019 All Rights Reserved.
                </div>
                <div class="col-sm-6">
                    <ul class="pull-right">
                        <li><a href="index.html">首页</a></li>
                        <li><a href="about-us.html">关于我们</a></li>
                        <li><a href="404.html">常见问题</a></li>
                        <li><a href="contact-us.html">联系我们</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>

    <!-- JAVASCRIPTS -->
    <script type="text/javascript" src="js/plugins.js"></script>
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.prettyPhoto.js"></script>
    <script src="js/jquery.isotope.min.js"></script>
    <script src="js/main.js"></script>
    <script src="js/wow.min.js"></script>
    <script src="js/portfolio.js"></script>
</body>


<div id="modalEmailSucc" class="modal fade">   <!--半透明遮罩-->
    <div class="modal-dialog modal-sm">   <!--对话框尺寸、位置-->
      <div class="modal-content">   <!--边框、倒角、背景色-->
        <!-- 头部 -->
        <div class="modal-header">
          <h4 class="modal-title">发送成功</h4>
        </div>
        <!-- 主体 -->
        <div class="modal-body">
          <p>感谢您的来信！</p>
        </div>
        <!-- 尾部 -->
        <div class="modal-footer">
          <button class="btn btn-success" style="color: whitesmoke;"  type="button" data-dismiss="modal"> 确定</button>
        </div>
      </div>  
    </div>
  </div>

</html>
